<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <link href="css/style.css" rel="stylesheet" type="text/css"/>

    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery3.3.1.min.js"></script>
    <script src="layui/layui.all.js"></script>
    <script src="layui/layui.js"></script>
    <link rel="stylesheet" href="layui/css/layui.css"/>
    <link rel="stylesheet" href="layui/css/layui.mobile.css"/>
    <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

    <!-- 引入 echarts.js -->
    <script type="text/javascript" src="js/echarts.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {

            $("#all").on('click', function () {
                $("tbody input:checkbox").prop("checked", $(this).prop('checked'));
            })
            $("tbody input:checkbox").on('click', function () {
                //当选中的长度等于checkbox的长度的时候,就让控制全选反选的checkbox设置为选中,否则就为未选中
                if ($("tbody input:checkbox").length === $("tbody input:checked").length) {
                    $("#all").prop("checked", true);
                } else {
                    $("#all").prop("checked", false);
                }
            })


        });

        function delAll() {
            var userInfoList = new Array();
            $('input[name="rid"]:checked').each(function () {
                userInfoList.push($(this).val());//向数组中添加元素
            });

            $.post("/delrechargerecording", {"listid": userInfoList}, function (data) {
                if (data == "0") {
                    $('input[name="rid"]:checked').parent().parent().remove();
                } else {
                    alert("删除失败！！");
                }
            })
        }


        /*点击页面提交form表单*/
        function gorr(cpage) {
            var url = "/rechargerecording?pageNum=" + cpage;
            $("#fo").attr("action", url);
            if ($("#ddlSearchType").val() != 0 && Number($("#span2").html()) != 0 && $("#dd").val() == null
            ) {
                var y = Number($("#span2").html());
                var c = "<option selected='selected' value='" + y + "'></option>";
                $("#dd").html(c);
            }
            $("#fo").submit();
        }

        /*点击*/
        function change() {
            var a = $("#ddlSearchType").val();
            if (a == 2) {
                $("#select2").css("display", "block");
                $("#input1").css("display", "none");
                $.post("/rechargerecordingid", {}, function (data) {
                    console.log(data);
                    var c = "";
                    for (var i = 0; i < data.length; i++) {
                        c += "<option value='" + data[i].id + "'>" + data[i].name + "</option>";
                    }
                    $("#dd").html(c);

                }, "json");
            } else if (a == 1 || a == 3) {
                $("#select2").css("display", "none");
                $("#input1").css("display", "block");
            }
        }


        /*统计*/
        function to() {
            layer.open({
                type: 2,
                skin: 'layui-layer-demo', //样式类名
                title: ["充值类型次数统计", "font-size:24px;"],
                anim: 2,
                area: ['600px', '450px'],
                shadeClose: true, //开启遮罩关闭
                content: "/getstatistics2"
            });
        }
    </script>

</head>


<body>

<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="#">首页</a></li>
        <li><a href="#">充值管理</a></li>
        <li><a href="#">充值记录浏览</a></li>
    </ul>
</div>

<div class="rightinfo">

    <form action="" method="post" id="fo">
        <div class="tools ">
            <ul class="toolbar">

                <li id="delect" onclick="delAll()"><span><img src="images/t03.png"/></span>删除</li>
                <li onclick="to()"><span><img src="images/t04.png"/></span><a>统计</a></li>
            </ul>
            <span style="float: left;line-height: 32px;height: 32px">查询：</span>
            <c:choose>
                <c:when test="${city!=0}">
                    <span id="span1" style="display: none">${city}</span>
                </c:when>
            </c:choose>
            <%--        <c:choose>
                        <c:when test="${cityi!=null}">--%>
            <span id="span2" style="display: none">${cityi}</span>
            <%--         </c:when>
                 </c:choose>--%>
            <select name="city" id="ddlSearchType" onclick="change()" <%-- lay-verify="required"--%>
                    style=" width: 100px; height:32px; border: #CBCBCB 1px solid;float: left;align-content: center">
                <option value="0">请选择</option>
                <option value="1">按玩家帐号</option>
                <option value="2">按卡类型</option>
                <option value="3">按订单号</option>
            </select>
            &nbsp;
            <c:choose>
                <c:when test="${input!='0'}">
                    <input id="input1" type="text" name="input" class="scinput" style="float: left;display: none"
                           value="${input}">
                </c:when>
                <c:otherwise>
                    <input id="input1" type="text" name="input" class="scinput" style="float: left;display: none">
                </c:otherwise>
            </c:choose>
            <div id="select2" style="float: left;width: 100px;height: 32px;display:none;">
                <select name='cityi' id='dd' lay-verify='required'
                        style=' width: 100px; height:32px; border: #CBCBCB 1px solid;float: left;align-content: center'>
                </select>
            </div>
            <input class="scbtn" onclick="gorr(1)" value="点击查询" style="float: left;height:32px "/>
        </div>
    </form>


    <table class="tablelist">
        <thead>
        <tr>
            <th><input type="checkbox" value="" id="all"/></th>
            <th>充值时间</th>
            <th>玩家账号</th>
            <th>代理商</th>
            <th>卡类型</th>
            <th>订单号</th>
            <th>订单金额</th>
            <th>实付金额</th>
            <th>充值前金币</th>
            <th>充值金币</th>
        </tr>
        </thead>
        <tbody id="list">
        <c:forEach items="${pageInfo.list}" var="temp">
            <tr>
                <td><input type="checkbox" name="rid" value="${temp.id}"/></td>
                <td>${temp.time}</td>
                <td>${temp.users.username}</td>
                <td>${temp.channel}</td>
                <td>${temp.recharge.name}</td>
                <td>${temp.orderid}</td>
                <td>${temp.recharge.rmb}</td>
                <td>${temp.recharge.rmb}</td>
                <td>${temp.beforegolds}</td>
                <td>${temp.recharge.golds}</td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
    <div class="pagin">
        <div class="message">共<i class="blue">${pageInfo.total}</i>条记录，当前显示第&nbsp;<i class="blue">${pageInfo.pageNum}&nbsp;</i>页
        </div>
        <div style="width:350px;margin:0 auto ;position:relative">
            <ul class="paginList">
                <li class="paginItem"><a onclick="gorr(1)">首页</a></li>
                <c:choose>
                    <c:when test="${pageInfo.hasPreviousPage}">
                        <li class="paginItem"><a onclick="gorr(${pageInfo.prePage})">上一页</a></li>
                    </c:when>
                    <c:otherwise>
                        <li class="paginItem"><a>上一页</a></li>
                    </c:otherwise>
                </c:choose>
                <c:choose>
                    <c:when test="${pageInfo.pageNum==2}">
                        <li class="paginItem"><a onclick="gorr(${pageInfo.pageNum-1})">${pageInfo.pageNum-1}</a></li>
                    </c:when>
                    <c:when test="${pageInfo.pageNum>2}">
                        <li class="paginItem"><a onclick="gorr(${pageInfo.pageNum-2})">${pageInfo.pageNum-2}</a></li>
                        <li class="paginItem"><a onclick="gorr(${pageInfo.pageNum-1})">${pageInfo.pageNum-1}</a></li>
                    </c:when>
                </c:choose>
                <li class="paginItem" style="background-color: #056dae;"><a onclick="gorr( ${pageInfo.pageNum})"
                                                                            style="color: white">${pageInfo.pageNum}</a>
                </li>
                <c:choose>
                    <c:when test="${pageInfo.pages-pageInfo.pageNum==1}">
                        <li class="paginItem"><a onclick="gorr(${pageInfo.pageNum+1})">${pageInfo.pageNum+1}</a></li>
                    </c:when>
                    <c:when test="${pageInfo.pages-pageInfo.pageNum>=2}">
                        <li class="paginItem"><a onclick="gorr(${pageInfo.pageNum+1})">${pageInfo.pageNum+1}</a></li>
                        <li class="paginItem"><a onclick="gorr(${pageInfo.pageNum+2})">${pageInfo.pageNum+2}</a></li>
                    </c:when>
                </c:choose>
                <c:choose>
                    <c:when test="${pageInfo.hasNextPage}">
                        <li class="paginItem"><a onclick="gorr(${pageInfo.nextPage})">下一页</a></li>
                    </c:when>
                    <c:otherwise>
                        <li class="paginItem"><a>下一页</a></li>
                    </c:otherwise>
                </c:choose>
                <li class="paginItem"><a onclick="gorr(${pageInfo.pages})">尾页</a></li>
            </ul>
        </div>
    </div>
</div>
</body>
<script>
    $(document).ready(function () {

        var x = Number($("#span1").html());
        $("#ddlSearchType").val(x);


    })

</script>
</html>
